frappe.pages['layui'].on_page_load = function (wrapper) {
	var page = frappe.ui.make_app_page({
		parent: wrapper,
		title: 'layui演示',
		single_column: true
	});
	// console.log(window)
	// page.load_data = function () {
	// 	console.log('loading...');
	// }
	// page.add_inner_button('刷新', () => page.load_data());
	console.log(page);
	console.log(wrapper.id);
	//$("head").append("<link rel='stylesheet' href='/assets/frappe_study/lib/layui/css/layui.css'>");	
	// $("<table class='layui-hide' id='layui_here'></table>").appendTo(page.main);
	// renderTable();
	wrapper.layui_controller = new frappestudy.layui_controller(wrapper,page);
}

if (!window.frappestudy) {window.frappestudy = {}};
frappestudy.layui_controller = class layui_controller {
	constructor(wrapper, page) {
		this.page_id = wrapper.id;
		this.page = page;
		this.init_dom();
		this.renderTable();
	}

	init_dom(){
		$("<table class='layui-hide table-class'></table>").appendTo(this.page.main);
		this.page.add_inner_button('刷新', () => this.load_data());
	}

	load_data(){
		console.log('loading...');
	}

	renderTable() {
		var elem = $("#" + this.page_id + " .table-class").first();
		console.log(elem);
		layui.use('table', function () {
			var table = layui.table;
			// 已知数据渲染
			var inst = table.render({
				elem: elem,
				cols: [[ //标题栏
					{ field: 'id', title: 'ID', width: 80, sort: true },
					{ field: 'username', title: '用户', width: 120 },
					{ field: 'sign', title: '签名', minWidth: 160 },
					{ field: 'sex', title: '性别', width: 80 },
					{ field: 'city', title: '城市', width: 100 },
					{ field: 'experience', title: '积分', width: 80, sort: true }
				]],
				data: [{ // 赋值已知数据
					"id": "10001",
					"username": "张三1",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "116"
				}, {
					"id": "10002",
					"username": "张三2",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "12",
				}, {
					"id": "10003",
					"username": "张三3",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "65"
				}, {
					"id": "10004",
					"username": "张三4",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "777"
				}, {
					"id": "10005",
					"username": "张三5",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "86"
				}, {
					"id": "10006",
					"username": "张三6",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "12"
				}, {
					"id": "10007",
					"username": "张三7",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "16"
				}, {
					"id": "10008",
					"username": "张三8",
					"sex": "男",
					"city": "浙江杭州",
					"sign": "人生恰似一场修行",
					"experience": "106"
				}],
				//skin: 'line', // 表格风格
				//even: true,
				page: true, // 是否显示分页
				limits: [5, 10, 15],
				limit: 5 // 每页默认显示的数量
			});
		});
	}
}
